<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
    <title>分享详情</title>
    <!-- Link Swiper's h5css -->
    <link rel="stylesheet" href="h5css/pub/swiper.min.css">
    <link rel="stylesheet" href="h5css/detail.css">
</head>
<body>
<main class="main swiper-container swiper-container-h">
    <script type="text/template" id="matchTemplate">
        <div class="swiper-slide">
            <header class="detail_header">
                <img class="header_img" src="h5image/detail_header.png" alt="help_img">
            </header>
            <section id="content" class="detail_content">
                <div class="same content_header">
                    <!--<img class="header_photo" src="h5image/header_photo.png" alt="">-->
                    <div class="header_photo">
                        <img src="<%=dataList.userHead%>" alt="">
                    </div>
                    <div class="header_person">
                        <!--<p class="person_name">学习雷锋（张培林）</p>-->
                        <p class="person_name"><%=dataList.userName%></p>
                        <span class="tag gender_age">
                    <img class="tag_gender" src="<%=dataList.gender%>" alt="gender">
                            <!--<strong class="tag_age">24</strong>-->
                    <strong class="tag_age"><%=dataList.birthday%></strong>
                    </span>
                        <!--<span class="tag tag_desc city">杭州</span>-->
                        <!--<span class="tag tag_desc job">设计师</span>-->
                        <!--<span class="tag tag_desc evaluate">讲义气</span>-->
                        <span class="tag tag_desc city"><%=dataList.publishCity%></span>
                        <span class="tag tag_desc job"><%=dataList.industry%></span>
                        <span class="tag tag_desc evaluate"><%=dataList.personalLabel%></span>
                    </div>
                </div>
                <div class="same aim">
                    <!--<img class="aim_img" src="h5image/aim.png" alt="help_img">-->
                    <img class="aim_img" src="<%=dataList.publishTypeIconURL%>" alt="">
                    <!--<span class="aim_title">寻找杭州上城区铺面一间，求帮</span>-->
                    <span class="aim_title"><%=dataList.publishTitle%></span>
                </div>
                <div class="same content">
                    <p class="content_detail" id="contentDetail"><%=dataList.publishContent%>
                    </p>
                    <!--<span class="all_btn" id="allBtn">全文</span>-->
                    <ul class="content_img" id="contentImg">
                        <% for (var i = 0; i < dataList.images.length; i++) { %>
                        <% var image = dataList.images[i] %>
                        <li><img src="<%=image%>" alt=""></li>
                        <% } %>
                    </ul>
                    <!--<img id="imageOpen" class="open_btn" src="h5image/open_btn.png" alt="open">-->
                </div>
                <div class="same content_footer">
                    <div class="footer_left">
                        <img class="footer_img city_img" src="h5image/btn_city.png" alt="city">
                        <!--发布城市-->
                        <span class="footer_font"><%= dataList.publishCity%></span>
                        <img class="footer_img time_img" src="h5image/btn_time.png" alt="time">
                        <!--<span class="footer_font">两天前</span>-->
                        <span class="footer_font"><%= dataList.publishTime%></span>
                    </div>
                    <div class="footer_right">
                        <!--是否公益-->
                        <% if(dataList.pstate){%>
                        <img class="footer_img msg_img" src="h5image/btn_love.png" alt="love">
                        <!--公益数-->
                        <span class="footer_font"><%= dataList.followSize%></span>
                        <% } %>
                        <img class="footer_img msg_img" src="h5image/btn_msg.png" alt="msg">
                        <!--<span class="footer_font">12</span>-->
                        <!--发布评论数-->
                        <span class="footer_font"><%= dataList.commentSize%></span>
                        <img class="footer_img trans_img" src="h5image/btn_trans.png" alt="trans">
                        <!--<span class="footer_font">52</span>-->
                        <!--发布转载数-->
                        <span class="footer_font"><%= dataList.publishForwordCount%></span>
                    </div>
                </div>
            </section>
            <footer class="detail_footer" id="footer">
                <!--是否公益-->
                <%if(dataList.pstate){%>
                <div class="love">
                    <img src="./h5image/love.png" alt="love">
                    <span>本条求助信息来自第三方平台
                    <span class="yellow">【<%=dataList.userName%>】</span>
                </span>
                </div>
                <%}else{%>
                <p>关系脉络</p>
                <ul>
                    <li class="person">
                        <!--<img src="h5image/header_photo.png" alt="h5image">-->
                        <!--<p>张培林</p>-->
                        <img src="<%= dataList.userHead%>" alt="">
                        <p><%= dataList.userName%></p>
                    </li>
                    <% if(dataList.helpUserName){ %>
                    <li clas="arrow" style="margin: 0 0.2rem;position: relative;width: 0.2rem;">
                        <!--<img src="h5image/arroow.png" alt="arrow">-->
                        <!--画箭头-->
                        <div class="arrow-right arrow-box">
                            <b class="right">
                                <i class="right-arrow1"></i>
                                <i class="right-arrow2"></i>
                            </b>
                        </div>
                    </li>
                    <li class="person">
                        <!--<img src="h5image/header_photo.png" alt="h5image">-->
                        <img src="<%= dataList.helpUserHead%>" alt="">
                        <!--<p>董海宁</p>-->
                        <p><%= dataList.helpUserName%></p>
                        <img class="zhuan" src="h5image/btn_zhuan.png" alt="转">
                    </li>
                    <%}%>
                    <!--<li class="level">-->
                    <!--<p>一度</p>-->
                    <!--</li>-->
                </ul>
                <%}%>
                <div class="help_btn" id="helpBtn"></div>
            </footer>

    </script>
    </div>
</main>
</body>
<script src="h5js/lib/zepto.min.js"></script>
<script src="h5js/lib/ejs.min.js"></script>
<script src="h5js/lib/swiper.min.js"></script>
<script src="h5js/public.js"></script>
<script src="h5js/detail.js"></script>

<!-- Initialize Swiper -->
<script>
    var swiperH = new Swiper('.swiper-container-h', {
        spaceBetween: 50,
        pagination: {
            el: '.swiper-pagination-h',
            clickable: true
        }
    });
</script>
</html>